export const crudOptions = (vm) => {
  return {
    pageOptions: {
      compact: true
    },
    options: {
      tableType: 'vxe-table',
      rowKey: false,
      width: '100%',
      height: '100%' // 表格高度100%, 使用toolbar必须设置
    },
    rowHandle: {
      width: 140,
      view: {
        thin: true,
        text: '',
        disabled () {
          return !vm.hasPermissions('Retrieve')
        }
      },
      edit: {
        thin: true,
        text: '',
        disabled () {
          return !vm.hasPermissions('Update')
        }
      },
      remove: {
        thin: true,
        text: '',
        disabled () {
          return !vm.hasPermissions('Delete')
        }
      }
    },
    viewOptions: {
      componentType: 'form'
    },
    formOptions: {
      defaultSpan: 12, // 默认的表单 span
      width: '900px',
      appendToBody: true // 配置表单是否插入至 body 元素上
    },
    indexRow: { // 或者直接传true,不显示title，不居中
      title: '序号',
      align: 'center',
      width: 100
    },
    columns: [
      {
        title: 'ID',
        key: 'id',
        width: 90,
        disabled: true,
        form: {
          disabled: true
        }
      },
      {
        title: '功能名称',
        key: 'name',
        search: {
          disabled: false
        },
        width: 160,
        type: 'input',
        form: {
          rules: [ // 表单校验规则
            { required: true, message: '功能名称不能为空' }
          ],
          component: {
            placeholder: '请输入功能名称'
          },
          itemProps: {
            class: { yxtInput: true }
          }
        }
      }, {
        title: '功能描述',
        key: 'description',
        show: false,
        search: {
          disabled: true
        },
        type: 'textarea',
        form: {
          rules: [ // 表单校验规则
            { required: true, message: '功能描述不能为空' }
          ],
          component: {
            placeholder: '请输入功能描述',
            showWordLimit: true,
            maxlength: '200',
            props: {
              type: 'textarea'
            }
          },
          itemProps: {
            class: { yxtInput: true }
          }
        }
      },
      {
        title: '功能图标',
        key: 'icon',
        type: 'avatar-cropper',
        width: 120,
        align: 'left',
        form: {
          component: {
            props: {
              elProps: { // 与el-uploader 配置一致
                multiple: false,
                limit: 1 // 限制5个文件
              },
              sizeLimit: 500 * 1024 // 不能超过限制
            },
            span: 12
          },
          rules: [ // 表单校验规则
            { required: true, message: '功能图标不能为空' }
          ],
          itemProps: {
            class: { yxtInput: true }
          }
        }
      }, {
        title: '功能大类',
        key: 'category',
        width: 140,
        search: {
          disabled: true
        },
        dict: {
          data: vm.dictionary('package_features_category')
        },
        form: {
          component: {
            placeholder: '请输入功能大类'
          },
          rules: [ // 表单校验规则
            { required: true, message: '功能大类不能为空' }
          ],
          itemProps: {
            class: { yxtInput: true }
          }
        }
      }, {
        title: '建议单价',
        key: 'unit_price',
        minWidth: 100,
        type: 'number',
        form: {
          value: 1.00,
          rules: [ // 表单校验规则
            { required: true, message: '排序必填项' }
          ],
          itemProps: {
            class: { yxtInput: true }
          }
        }
      }, {
        title: '是否必选',
        key: 'is_required',
        search: {
          disabled: false
        },
        type: 'radio',
        minWidth: 100,
        dict: {
          data: vm.dictionary('button_whether_bool')
        },
        form: {
          value: true,
          rules: [ // 表单校验规则
            { required: true, message: '必填项' }
          ],
          component: {
            span: 12,
            offset: 12,
            placeholder: '请选择状态'
          },
          itemProps: {
            class: { yxtInput: true }
          }
        },
        component: { props: { color: 'auto' } }
      }, {
        title: '功能菜单',
        key: 'features_menu',
        type: 'tree-selector',
        search: {
          disabled: false
        },
        minWidth: 120,
        rowSlot: true,
        form: {
          value: true,
          component: {
            placeholder: '请选择状态'
          },
          rules: [ // 表单校验规则
            { required: true, message: '必填项' }
          ],
          itemProps: {
            class: { yxtInput: true }
          },
          slot: true
        },
        component: { props: { color: 'auto' } }
      },
      {
        title: '状态',
        key: 'status',
        search: {
          disabled: false
        },
        type: 'radio',
        minWidth: 100,
        dict: {
          data: vm.dictionary('button_status_bool')
        },
        form: {
          value: true,
          component: {
            placeholder: '请选择状态'
          },
          rules: [ // 表单校验规则
            { required: true, message: '排序必填项' }
          ],
          itemProps: {
            class: { yxtInput: true }
          }
        },
        component: { props: { color: 'auto' } }
      }, {
        title: '排序',
        key: 'sort',
        minWidth: 100,
        type: 'number',
        form: {
          value: 1,
          component: {
          },
          rules: [ // 表单校验规则
            { required: true, message: '排序必填项' }
          ],
          itemProps: {
            class: { yxtInput: true }
          }
        }
      }
    ].concat(vm.commonEndColumns({
      update_datetime: { showTable: false },
      description: { showTable: false, showForm: false }
    }))
  }
}
